<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="box">123456</div>
</body>

</html>
<script>
    //一.this关键字
    //1.this是javascript里面的一个关键字,存在于函数内部。随着函数的调用，this的指向会发生变化。有一个总的指向原则，this指向函数的调用者。
    //谁调用函数，this指向谁，如果函数前面没有任何对象进行调用，指向window.

    //2.测试不同函数的this指向。
    //普通函数，自执行函数
    // function fn() {
    //     alert(this);
    // }

    // fn(); //window
    // window.fn(); //window

    // ! function() {
    //     alert(this); //window
    // }();

    // 事件处理函数 - 重要的
    // document.onclick = function() {//document调用函数，this指向document
    //     alert(this);//[object HTMLDocument]
    // }

    // box.onclick = function() {
    //     alert(this); //[object HTMLDivElement]
    // }


    // 对象下面的方法。
    // var obj = {
    //     name: 'zhangsan',
    //     showname: function() {
    //         console.log(this); //obj
    //         console.log(this.name); //obj.name / zhangsan
    //     }
    // }
    // obj.showname();


    // var obj1 = {
    //     name: 'lisi',
    //     obj2: {
    //         name: 'wangwu',
    //         showname: function() {
    //             console.log(this.name);
    //         }
    //     }
    // }
    // obj1.obj2.showname(); //this->obj2  wangwu
</script>